<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>首页 - 华鑫农业后台管理系统后台管理系统</title>
<link rel="icon" href="favicon.ico" type="image/ico">
<link href="../css/bootstrap.min.css" rel="stylesheet">
<link href="../css/materialdesignicons.min.css" rel="stylesheet">
<link href="../css/style.min.css" rel="stylesheet">
    <script type="text/javascript" src="../js/jquery.min.js"></script>
<%--    <script type="text/javascript" src="../js/template-web.js"></script>--%>
</head>
<body>
<div class="lyear-layout-web">
  <div class="lyear-layout-container">
<%--    菜单栏--%>
    <jsp:include page="left_nav.jsp"/>

    <script type="text/javascript">

        for (let i = 1; i <= 6; i++) {
            $("#nav" + i).attr("class", "nav-item");
        }
        $("#nav1").attr("class", "nav-item active");
    </script>
<%--头部--%>
   <jsp:include page="header.jsp"/>

    <!--页面主要内容-->
    <main class="lyear-layout-content">

      <div class="container-fluid">

        <div class="row">
          <div class="col-lg-12">
            <div class="card">
              <div class="card-toolbar clearfix">

<%--                搜索功能的页面--%>
                <form class="pull-right search-bar" method="get" action="#!" role="form">
                  <div class="input-group">
                    <div class="input-group-btn">
                      <input type="hidden" name="search_field" id="search-field" value="title">
                      <button class="btn btn-default dropdown-toggle" id="search-btn" data-toggle="dropdown" type="button" aria-haspopup="true" aria-expanded="false">
                        内容 <span class="caret"></span>
                      </button>
                      <ul class="dropdown-menu">
                        <li> <a tabindex="-1" href="javascript:void(0)" data-field="title">内容</a> </li>
                        <li> <a tabindex="-1" href="javascript:void(0)" data-field="cat_name">时间</a> </li>
                      </ul>
                    </div>
                    <input type="text" class="form-control" value="" name="keyword" placeholder="请输入名称">
                  </div>
                </form>
                <div class="toolbar-btn-action">
                  <a class="btn btn-primary m-r-5" href="#!" data-toggle="modal" data-target="#myModal"><i class="mdi mdi-plus" ></i> 新增</a>
                </div>
              </div>
              <div class="card-body">

                <div class="table-responsive">
                  <table class="table table-bordered">
                    <thead>
                    <tr>

                      <th>编号</th>
                      <th>简介内容</th>
                      <th>操作时间</th>
                      <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="tb_data">
                    </tbody>
                  </table>
                </div>


                <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                  <div class="modal-dialog" role="document">
                    <div class="modal-content">
                      <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">新增公司简介</h4>
                      </div>
                      <div class="modal-body">
                          <textarea  class="form-control" id="example-textarea-input" name="example-textarea-input" rows="6" placeholder="简介内容.."></textarea>
                      </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="addCompanyItem()">点击保存</button>
                      </div>
                    </div>
                  </div>
                </div>

                <div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                      <div class="modal-dialog" role="document">
                          <div class="modal-content">
                              <div class="modal-header">
                                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                  <h4 class="modal-title" id="myModalLabel2">更新公司简介</h4>
                              </div>
                              <div class="modal-body">
                                  <textarea  class="form-control" id="example-textarea-updata" name="example-textarea-input" rows="6" placeholder="简介内容.."></textarea>
                              </div>
                              <div class="modal-footer">
                                  <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                                  <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="onClickUpdata()">点击保存</button>
                              </div>
                          </div>
                      </div>
                  </div>
<%--                分页，先不实现--%>
<%--                <ul class="pagination">--%>
<%--                  <li class="disabled"><span>«</span></li>--%>
<%--                  <li class="active"><span>1</span></li>--%>
<%--                  <li><a href="#1">2</a></li>--%>
<%--                  <li><a href="#1">3</a></li>--%>
<%--                  <li><a href="#1">4</a></li>--%>
<%--                  <li><a href="#1">5</a></li>--%>
<%--                  <li><a href="#1">6</a></li>--%>
<%--                  <li><a href="#1">7</a></li>--%>
<%--                  <li><a href="#1">8</a></li>--%>
<%--                  <li class="disabled"><span>...</span></li>--%>
<%--                  <li><a href="#!">14452</a></li>--%>
<%--                  <li><a href="#!">14453</a></li>--%>
<%--                  <li><a href="#!">»</a></li>--%>
<%--                </ul>--%>

              </div>
            </div>
          </div>

        </div>

      </div>

    </main>
    <!--End 页面主要内容-->
  </div>
</div>


<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="../js/main.min.js"></script>
<script src="../js/myScript/app.js"></script>
<script type="text/javascript">
    var resData;
    function getQeuryAllCommpan() {
        $.ajax({
            type: "get",
            async: true,
            url: serverUrl + "/company/queryCompany",
            dataType: "json",
            success: function (res) {
                if (res.success) {
                    //请求成功
                    resData = res.data;
                    for (let i = 0; i < resData.length; i++) {
                        var item = resData[i];

                        $("#tb_data").append("<tr>\n" +
                            "                      <td id=\""+ item.cyId +"\">"+ item.cyId +"</td>\n" +
                            "                      <td>"+ item.cyMessage +"</td>\n" +
                            "                      <td>" + item.cyTime + "</td>\n" +
                            "                      <td>\n" +
                            "                        <div class=\"btn-group\">\n" +
                            "                          <a id=\'"+ item.cyId +"\' class=\"btn btn-xs btn-default\" href=\"#!\" title=\"编辑\"  data-toggle=\"modal\" data-target=\"#myModal2\" onclick='upDataCompanyItem(this)'><i class=\"btn btn-sm btn-primary\">编辑</i></a>\n" +
                            "                          <a id=\'"+ item.cyId +"\' class=\"btn btn-xs btn-default\" href=\"#!\" title=\"删除\" data-toggle=\"tooltip\" onclick='deleteCompanyItem(this)'><i class=\"btn btn-sm btn-danger\">删除</i></a>\n" +
                            "                        </div>\n" +
                            "                      </td>\n" +
                            "                    </tr>");

                    }
                } else {
                    alert(res.msg);
                }

            },
            error: function (res) {
              alert("请求出错");
            }
        });
    }

    //加载页面调用一次
    getQeuryAllCommpan();
    /**
     * 新增功能
     * @param cyId
     */
  function addCompanyItem() {
      //获取到text文本框内容
       var textData =  $("#example-textarea-input").val();
       //发送ajax请求
        $.ajax({
            type: "POST",
            contentType:"application/json;charset=UTF-8",
            url: serverUrl + "/company/addCompany",
            data: JSON.stringify({"cyMessage":textData}),
            dataType: "json",
            success: function (res) {
                if (res.success) {
                    //清楚表，数据然后，调用ajax请求查询一次新数据
                    $("#tb_data").empty();
                    getQeuryAllCommpan();
                } else {
                    alert(res.msg);
                }
            },
            error: function (res) {
                alert("请求出错");
            }
        });

        $("#example-textarea-input").val("");

  }

    /**
     * 修改指定的简介
     */
    function upDataCompanyItem(element) {
      //修改的id号
      var cyId = element.getAttribute("id");

      $.ajax({
          type: "GET",
          url: serverUrl + "/company/queryCompanyById?CyId=" + cyId,
          dataType: "json",
          success: function (res) {
              if (res.success) {
                  $("#example-textarea-updata").val(res.data.cyMessage);
                  $("#example-textarea-updata").attr("name", cyId);
              } else {
                  alert(res.msg);
              }
          },
          error: function (res) {
              alert("请求失败");
          }
      });
    }

    /**
     * 保存更新的数据
     */
    function onClickUpdata() {
       var id = $("#example-textarea-updata").attr("name");
       var contentData = $("#example-textarea-updata").val();
       $.ajax({
           type: "POST",
           contentType:"application/json;charset=UTF-8",
           url: serverUrl + "/company/updateCompany",
           dataType: "json",
           data: JSON.stringify({"cyId": id, "cyMessage": contentData}),
           success: function (res) {
               if (res.success) {
                   $("#tb_data").empty();
                   getQeuryAllCommpan();
               } else {
                   alert("更新数据错误");
               }

           },
           error: function (res) {
               alert("请求错误");

           }
       })

    }
    /**
     * 删除选中的item
     */
    function deleteCompanyItem(element) {
      //修改的id号
      var cyId = element.getAttribute("id");
      $.ajax({
          type: "GET",
          url: serverUrl + "/company/deleteCompany?CyId=" + cyId,
          dataType: "json",
          success: function (res) {
                if (res.success) {
                    //清楚表，数据然后，调用ajax请求查询一次新数据
                    $("#tb_data").empty();
                    getQeuryAllCommpan();
                }
          },
          error: function (res) {
              alert("请求出错");
          }
      });
    }
</script>
</body>
</html>
